<template>
  <div>
      <el-row>
          <el-col id="videoInfo" :span="24">
               <table class="userInfoEditTable" style="border-collapse:collapse;background-color:white;" width="100%" cellspacing="0">
                   <tr v-for="(v,k,i) in form" :key="v">
                       <td class="tb_label">{{labels[i]}}</td>
                       <td>
                           {{v}}
                       </td>
                   </tr>
                    <tr>
                      <td colspan="2" align="center">
                        <el-button type="text" size="large" @click="printTable('videoInfo')">[打印]</el-button>
                      </td>
                  </tr>
               </table>
          </el-col>
      </el-row>
  </div>
</template>

<script>
import * as api from "@/api/zonghezhili/duiwujianshe";
export default {
  props:{
    id:String,
  },
  watch:{
    id:function (val) {
      api.getOrgBasicInfDetail(this.id).then(res => {
      this.form = res.data;
    });
    }
  },
  data() {
    return {
      form: {
        orgID: "",
        orgName: "", //              varchar(100) not null comment '机构名称',
        orgTypeValue: "", //         varchar(2),
        levelTypeValue: "", //       varchar(2),
        netGridID: "", //            bigint,
        orgCreateDate: "", //        date,
        orgContactName: "", //       varchar(50) comment '机构联系人姓名',
        orgContactTel: "", //        varchar(20) comment '机构联系电话',
        orgBriefIntroduction: "", // varchar(200),
        businessGuidanceDepartment: "", // varchar(200) comment '业务指导部门',
        personNumber: "", //         int comment '人员数量',
        mainFunction: "" //         varchar(1024) comment '主要职能',
      },
      labels: [
        "编号",
        "机构名称",
        "机构类型",
        "机构级别",
        "所属网格",
        "机构创建时间",
        "机构联系人",
        "机构联系电话",
        "机构简介",
        "业务指导部门",
        "人员数量",
        "主要职能"
      ]
    };
  },
  methods: {
    printTable(div) {
      var div_print = document.getElementById(div);
      var newStr = div_print.innerHTML;
      var oldStr = document.body.innerHTML;
      document.body.innerHTML = newStr;
      window.print();
      window.location.reload();
      window.body.innerHTML = oldStr;
      return false;
    },
    goBack() {
      this.$router.go(-1);
    }
  },
  mounted() {
    api.getOrgBasicInfDetail(this.id).then(res => {
      this.form = res.data;
    });
  }
};
</script>

<style scoped>
.userInfoEditTable,
.userInfoEditTable td {
  border: 1px solid darkgrey;
  padding: 10px;
}

.tb_label {
  width: 15%;
  text-align: right;
}
</style>
